<template>
    <div class="listedSuccess">
        <van-nav-bar title="上架成功" left-arrow @click-left="handleLeft">
            <template #right>
                <div @click="successClick">完成</div>
            </template>
        </van-nav-bar>
        <div class="image">
            <van-image :src="complement" class="menu_cions" />
        </div>
        <div class="buttons">
            <!-- <div class="view" @click="viewClick">上架记录</div> -->
            <div class="continue" @click="continueClick">继续上架</div>
        </div>
    </div>
</template>
<script setup lang="ts">
import { computed } from "vue";
import { useRoute, useRouter } from "vue-router";
const router = useRouter();
const complement = new URL("@/assets/productHome/icon_shangjiachenggong.png", import.meta.url).href;
const route = useRoute();
/** 上级路由 */
const fromkey = computed(() => {
    return route.query.from;
});
/** 上级路由 */
const shelvesStatus = computed(() => {
    return route.query.shelvesStatus;
});
/** 上级路由 */
const shelvesStatusName = computed(() => {
    return route.query.shelvesStatusName;
});
/** 回退 */
const handleLeft = () => {
    router.back();
}
/** 完成 */
const successClick = () => {
    router.push('/productHome')
}
/** 上架记录 */
// const viewClick = () =>{
//     router.push('/listingRecord')
// }
/** 继续上架 */
const continueClick = () =>{
    if(fromkey.value == 'home'){
        router.push('/productHome')
    }else{
        router.push({ path: "/productHome/productLists", query: { shelvesStatus: shelvesStatus.value, shelvesStatusName: shelvesStatusName.value } });
    }
}
</script>


<style lang="less" scoped>
.listedSuccess {
    width: 100%;
    height: calc(100vh - 50px);
    .image {
        width: 157px;
        height: 144px;
        margin: auto;
        padding-top: 132px;
    }

    .buttons {
        width: 100%;
        padding-top: 30px;
        display: flex;
        justify-content: space-around;

        .view {
            width: 142px;
            height: 44px;
            border-radius: 23px;
            border: 1px solid #0094FF;
            text-align: center;
            line-height: 44px;
            background: #FFFFFF;
            font-weight: 500;
            font-size: 16px;
            color: #0094FF;
        }
        .continue{
            width: 142px;
            height: 44px;
            border-radius: 23px;
            background: #0094FF;
            text-align: center;
            line-height: 44px;
            background: #0094FF;
            font-weight: 500;
            font-size: 16px;
            color: #FFFFFF;
        }
    }
}

:deep(.van-nav-bar) {
    background-color: #1466ff;
    height: 46px !important;
    width: 100%;
    position: fixed !important;
}

:deep(.van-nav-bar__title) {
    color: #000;
}

:deep(.van-nav-bar__text) {
    color: #000;
}

:deep(.van-nav-bar__right) {
    color: #0094FF;
    font-weight: 500;
    font-size: 14px;
    color: #0094FF;
}
</style>